<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加车位</title>
    <link rel="stylesheet" href="layui/css/layui.css">
    <!--引入Layui的js库,模块化方式(推荐)，不用导入layui.all.js-->
    <script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="layui-container" style="margin-top: 20px">
    <div class="layui-row">
        <div class="layui-col-md6 layui-col-md-offset3">
            <form class="layui-form"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
                <div class="layui-form-item">
                    <label class="layui-form-label">层位数</label>
                    <div class="layui-input-block">
                        <input type="text" name="floorNumber" placeholder="层位数" class="layui-input" value="1">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" for="areaCode">区号</label>
                    <div class="layui-input-block">
<!--                        <input type="text" name="areaCode" placeholder="区号" class="layui-input">-->
                        <select id="areaCode" name="areaCode" class="layui-select">
                            <option value="A">A</option>
                            <option value="B">B</option>
                            <option value="C">C</option>
                            <option value="D">D</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">车位号</label>
                    <div class="layui-input-block">
                        <input type="text" name="parkingNumber" placeholder="车位号" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">单价</label>
                    <div class="layui-input-block">
                        <input type="text" name="unitPrice" placeholder="单价" class="layui-input" value="2">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="addSpace">添加</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>

            </form>
        </div>
    </div>
</div>

<script>
    layui.use(['form', 'layer', 'jquery'], function () {
        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.jquery;
        form.on('submit(addSpace)', function (obj) {
            console.log("obj=", obj.field);
            //AJAX请求
            $.post("insertSpace", obj.field, function (d) {
                console.log(d);
                if (d != 1) {   //插入不成功
                    layer.msg(d);
                } else {      //插入成功
                    //关闭弹出层
                    // layer.getFrameIndex(windowName) - 获取特定iframe层的索引
                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.layer.close(index); //再执行关闭
                }
            }, "json");
            //取消form提交的默认行为
            return false;
        });
    });
</script>
</body>
</html>